<template>
	<view>
    <!-- 商品列表 -->
		<view class="goods-list">
      <view v-for="(item,index) in goodsList" :key="index" @click="goToGoodsDetail(item.goods_id)">
        <my-goods :item="item"></my-goods>
      </view>
    </view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				// 商品列表请求对象
        queryObj:{
          // 关键字查询
          query:'',
          // id查询
          cid:'',
          // 页码
          pageNum:1,
          // 每页多少条
          pageSize:10
        },
        // 商品列表
        goodsList:[],
        // 商品总数
        total:0,
        // 请求节流阀
        isLoading:true
			}
		},
    onLoad(options) {
      // 获取路径传参的相关查询参数
      this.queryObj.query = options.query || '',
      this.queryObj.cid = options.cid || ''
      // 获取商品列表
      this.getGoodsList()
    },
		methods: {
			async getGoodsList(cb) {
        // 发送请求前，打开节流阀
        this.isLoading = true
        const {data:res} = await uni.$http.get('/api/public/v1/goods/search',this.queryObj)
        // 请求完毕后，关闭节流阀
        this.isLoading = false
        cb && cb()
        if(res.meta.status !== 200) return uni.$showMsg()
        this.goodsList = [...this.goodsList,...res.message.goods]
        this.total = res.message.total
      },
      goToGoodsDetail(id) {
        uni.navigateTo({
          url:'/subpkg/goods_detail/goods_detail?goods_id='+id
        })
      }
		},
    // 上拉加载下一页数据
    onReachBottom() {
      // 判断是否有下一页数据
      if(this.queryObj.pageNum*this.queryObj.pageSize >= this.total) return uni.$showMsg('数据加载完毕!')
      // 若上一页的数据未加载完成，不允许重复发送请求
      if(this.isLoading) return
      // 当上拉触底时，加载下一页的数据
      this.queryObj.pageNum++
      this.getGoodsList()
    },
    // 下拉刷新列表数据
    onPullDownRefresh() {
      // 重置相关数据：页码、数据总数、节流阀、商品列表
      this.queryObj.pageNum = 1
      this.total = 0
      this.isLoading=false,
      this.goodsList = []
      // 重新发送获取商品列表请求
      this.getGoodsList(() => uni.stopPullDownRefresh())
      
    }
	}
</script>

<style lang="scss">

</style>
